<template>
  <el-dialog :title="detailData.label" :close-on-click-modal="false" :visible.sync="visible" @closed="onClose">
    <template v-if="visible">
      <info-data :render-info-item="renderInfoItem" :info-data="detailData" />
    </template>
  </el-dialog>
</template>

<script>
import InfoData from '@/components/InfoData'
export default {
  components: { InfoData },

  data: function() {
    return {
      visible: false,
      detailData: {},
      renderInfoItem: []
    }
  },
  methods: {
    open(detailData, renderInfoItem) {
      this.$data.detailData = detailData
      this.$data.renderInfoItem = renderInfoItem
      this.$data.visible = true
    },
    onClose() {
      this.$data.detailData = {}
    }
  }
}
</script>

<style lang="scss" scoped>
  .imgItem{
    width: 100px;
    height: 100px;
    margin-right: 10px;
  }
</style>
